<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title th:text="用户信息">User</title>
    <!--默认拼接前缀路径,开头请勿再添加斜杠,防止部署运行报错！-->
    <script th:replace="common/head::static"></script>
    <!-- DataTables -->
    <link rel="stylesheet" th:href="@{/bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css}">
    <!-- AdminLTE Skins. Choose a skin from the css/skins
         folder instead of downloading all of them to reduce the load. -->
    <link rel="stylesheet" th:href="@{/dist/css/skins/_all-skins.min.css}">
</head>
<body>
<div class="with:60%">
    <form class="form-horizontal"   th:action="@{/user}"  method="get">
        <div class="form-group">
            <label for="username" class="col-sm-2 control-label">用户名</label>
            <div class="col-sm-6">
                <input type="text" class="form-control" name="username"  id="username" placeholder="username"/>
            </div>
            <div class="col-sm-3">
                <input type="submit" value="提交" class="btn btn-info" />
            </div>
        </div>
    </form>
</div>
<div class="with:40%">
    <a class="btn btn-info" th:href="@{/user/add}">新增</a>
</div>
<div th:each="user,userStat:${userList.getContent()}" th:class="${userStat.even}?'even':'odd'">
    序号：<input type="text" th:value="${userStat.count}"/>
    账号：<input type="text" th:value="${user.username}"/>
    密码：<input type="password" th:value="${user.password}"/>
    密码：<input type="email" th:value="${user.email}"/>
    时间：<input type="text" th:value="${user.createTime}"/>
    <a th:href="@{/user/toEdit(id=${user.id})}" class="btn btn-info">编辑</a>
    <a th:href="@{/user/toDelete(id=${user.id})}" class="btn btn-warning">删除</a>
</div>
<div class="pagelist">
    <p>当前<span th:text="${userList.getNumber()} + 1"></span>页,总<span th:text="${userList.totalPages}"></span>页
        　　　　　　　　　　　　　　　　　共<span th:text="${userList.totalElements}"></span>条记录
        <a th:href="@{/user(username = ${username})}">首页</a>
        <a th:href="@{/user(pageIndex = ${userList.hasPrevious()} ? ${userList.getNumber() } -1 : 0,username = ${username})}">上一页</a>
        <a th:href="@{/user(pageIndex = ${userList.hasNext()} ? ${userList.getNumber()} + 1 : ${userList.totalPages}-1,username = ${username})}">下一页</a>
        <a th:href="@{/user(pageIndex = ${userList.totalPages}-1,username = ${username})}">尾页</a></p>
</div>

<!-- JavaScript -->
<!--<script src="/js/main.js" th:src="@{/js/main.js}"></script>-->
<script th:inline="javascript">
    //通过内联表达式获取用户信息
    var userList = [[${userList}]];
    console.log(userList)
</script>
</body>
</html>